<template>
	<uv-skeletons :loading="loading" :skeleton="skeleton" :animate="true" />
</template>

<script setup>
	import {
		onMounted,
		ref,
		reactive,
		computed,
		watch
	} from "vue";
	const props = defineProps({
		loading:{
			type:Boolean,
			default: false
		}
	})
	let skeleton = [{
		type: 'flex',
		num: 1,
		children: [{
			type: 'custom',
			num: 1,
			style: 'width:690rpx;height:180rpx;borderRadius: 32rpx;'
		}]
	}, 30, {
		type: 'flex',
		num: 1,
		children: [{
			type: 'custom',
			num: 1,
			style: 'width:332rpx;height:128rpx;marginRight: 26rpx;'
		}, {
			type: 'custom',
			num: 1,
			style: 'width:332rpx;height:128rpx;'
		}]
	}, 30, {
		type: 'flex',
		children: [{
			type: 'custom',
			style: 'width:198rpx;height:132rpx;marginRight:24rpx;marginLeft:24rpx;'
		}, {
			type: 'custom',
			style: 'width:198rpx;height:132rpx;marginRight:24rpx;'
		}, {
			type: 'custom',
			style: 'width:198rpx;height:132rpx;'
		}]
	},30,{
		type: 'flex',
		num: 1,
		children: [{
			type: 'custom',
			num: 1,
			style: 'width:642rpx;height:178rpx;borderRadius: 20rpx;marginLeft:24rpx;'
		}]
	},30,{
		type: 'flex',
		children: [{
			type: 'custom',
			style: 'width:100rpx;height:100rpx;marginRight:150rpx;marginLeft:44rpx;borderRadius: 32rpx;'
		}, {
			type: 'custom',
			style: 'width:100rpx;height:100rpx;marginRight:150rpx;borderRadius: 32rpx;'
		}, {
			type: 'custom',
			style: 'width:100rpx;height:100rpx;borderRadius: 32rpx;'
		}]
	},30,{
		type: 'flex',
		num: 1,
		children: [{
			type: 'custom',
			num: 1,
			style: 'width:690rpx;height:128rpx;borderRadius: 24rpx;'
		}]
	},]
</script>

<style>
</style>